﻿@model RiderShop.Mobile.Modle.MyAccount.MyPromotionCodeModel
@{
    Layout = "../Shared/_MobileLayout.cshtml";
}
@section title
{
    @if (Model.PromotionType == 0)
    {
        @Html.Raw("我的优惠券")
    }
    else if (Model.PromotionType == 1)
    {
        @Html.Raw("我的红包")
    }
}
@section pagetitle
{
    @if (Model.PromotionType == 0)
    {
        @Html.Raw("我的优惠券")
    }
    else if (Model.PromotionType == 1)
    {
        @Html.Raw("我的红包")
    }
}
<div class="userCenterHeader">
    <span class="iconWrapper">
        <img src="~/Themes/RongJi/Style/base/imgs/icon_hui.png">
    </span>
    <h3>
        @if (Model.PromotionType == 0)
        {
            @Html.Raw("我的优惠券")
        }
        else if (Model.PromotionType == 1)
        {
            @Html.Raw("我的红包")
        }
    </h3>
    <br class="clearfix">
</div>
@if (Model.TotalCount == 0)
{ 
    <div class="box">
        <div id="empty" style="text-align: center">
            <p>
                @if (Model.PromotionType == 0)
                {
                    @Html.Raw("暂无优惠券")
                }
                else if (Model.PromotionType == 1)
                {
                    @Html.Raw("暂无红包")
                }
            </p>
            <div class="btn btn-default">
                <a href="/Home" class="empty_go_main">去逛逛</a>
            </div>
        </div>
    </div>
}
else
{
    <div class="box">
        <div class="panel">
            <ul class="nav nav-tabs nav-justified">
                <li class="active">
                    <a data-toggle="tab" href="#all" id="noUse">未使用(@Model.NoUsePromotionCodeTotalCount)</a>
                    <input type="hidden" id="noUsePromotionCodeTotalPage" value="@Model.NoUsePromotionCodeTotalPage">
                </li>
                <li class="">
                    <a data-toggle="tab" href="#get" id="use">已使用(@Model.UsedPromotionCodeTotalCount)</a>
                    <input type="hidden" id="usedPromotionCodeTotalPage" value="@Model.UsedPromotionCodeTotalPage">
                </li>
                <li class="">
                    <a data-toggle="tab" href="#using" id="expiration">已过期(@Model.ExpirePromotionCodeTotalCount)</a>
                    <input type="hidden" id="expirePromotionCodeTotalPage" value="@Model.ExpirePromotionCodeTotalPage">
                </li>
            </ul>
            <div class="tab-content" id="myTabContent">
                <div id="myPromotionCodeList">
                    @{
                        Html.RenderPartial("MyPromotionCodePartial", Model);
                    }
                </div>
            </div>
            <input type="hidden" id="promotiontype" value="@Model.PromotionType">
            <div id="showMore" page="1" status="0">
                更多...
            </div>
        </div>
    </div>
}
@section footer
{
    <script>
        $(function () {
            var totalPage = $("#noUsePromotionCodeTotalPage").val();
            var isloading = false;
            var counter = 1;
            var promotionType = $('#promotiontype').val();

            //让toolbar选中
            var $homeImg = $("#homeImg");
            var $categoryImg = $("#categoryImg");
            var $myaccountImg = $("#myaccountImg");
            var $searchImg = $("#searchImg");
            $homeImg.attr("src", "/Themes/RongJi/Style/base/imgs/f10.png");
            $categoryImg.attr("src", "/Themes/RongJi/Style/base/imgs/f2.png");
            $myaccountImg.attr("src", "/Themes/RongJi/Style/base/imgs/f3_c.png");
            $searchImg.attr("src", "/Themes/RongJi/Style/base/imgs/f4.png");

            //当只有一页数据时'更多'不需要显示出来
            if (totalPage <= 1) {
                $("#showMore").hide();
            }

            /*---------------------显示对应类型的的优惠券--------------------*/
            //得到未使用的优惠券
            $("#noUse").click(function () {
                totalPage = $("#noUsePromotionCodeTotalPage").val();
                getPromotionCode(0, '未使用', totalPage);
            });

            //得到已使用的优惠券
            $("#use").click(function () {
                totalPage = $("#usedPromotionCodeTotalPage").val();
                getPromotionCode(1, '已使用', totalPage);
            });

            //得到已过期的优惠券
            $("#expiration").click(function () {
                totalPage = $("#expirePromotionCodeTotalPage").val();
                getPromotionCode(2, '已过期', totalPage);
            });

            /*---------------------得到优惠券--------------------*/
            function getPromotionCode(status, statusText, totalPage) {
                $("#myPromotionCodeList").empty();
                $('#showMore').attr('page', 1);
                $('#showMore').attr('status', status);
                if (totalPage <= 1) {
                    $("#showMore").hide();
                }
                else {
                    $("#showMore").show().html('更多...');
                }
                $.ajax({
                    type: "GET",
                    url: "MyPromotionCodeByAjaxRequest?status=" + status + "&pageIndex=0&promotionType=" + promotionType,
                    success: function (response) {
                        $("#myPromotionCodeList").append(response);
                    },
                    error: function (err) {
                        //alert(err.responseText);
                    }
                });
            }

            /*---------------------得到下页优惠券数据--------------------*/
            $(window).bind("scroll", function () {
                if (totalPage > 1) {
                    if ($(document).scrollTop() + $(window).height() >= $(document).height()) {
                        var pageIndex = $('#showMore').attr('page');
                        var status = $('#showMore').attr('status');
                        $('#showMore').show().html('加载中...');
                        if (pageIndex >= totalPage) {
                            $("#showMore").show().html('加载完毕').delay(2300).slideUp(1600);
                            return;
                        }
                        if (isloading) {
                            return;
                        }
                        isloading = true;
                        $.ajax({
                            type: "GET",
                            url: "MyPromotionCodeByAjaxRequest?status=" + status + "&pageIndex=" + pageIndex + "&promotionType=" + promotionType,
                            success: function (response) {
                                isloading = false;
                                $('#showMore').attr('page', parseInt(pageIndex) + 1);
                                $("#myPromotionCodeList").append("<div id='tbody" + counter + "' style='margin-top:100px;opacity:0.3'></div>");
                                $("#tbody" + counter).append(response).animate({ opacity: '1', marginTop: 0 }, 2000);
                                counter++;
                            },
                            error: function (err) {
                                //alert(err.responseText);
                            }
                        });
                    }
                }
            });
        });
    </script>
}


